<template>
  <a-modal width="35%" v-bind:visible="isShowAdd" :title="title" @ok="onOk" @cancel="onCancel">
    <a-form-model ref="formRef" :model="form" :rules="formRule" :label-col="{ span: 6 }" :wrapper-col="{ span: 14 }">
      <a-form-model-item label="等级Id" prop="level_id">
        <a-input-number style="width: 100%" placeholder="请输入等级ID" id="inputNumber" v-model="form.level_id" />
      </a-form-model-item>
      <a-form-model-item label="金额" prop="money">
        <a-input placeholder="请输入金额" v-model="form.money"></a-input>
      </a-form-model-item>
      <a-form-model-item label="级别时长类型" prop="upgrade_money">
        <a-select v-model="form.type" placeholder="请选择级别时长类型">
          <a-select-option
            v-for="item in [
              { id: 0, name: '永久' },
              { id: 1, name: '月卡' },
              { id: 2, name: '季卡' },
              { id: 3, name: '年卡' }
            ]"
            :key="item.id"
            :value="item.id"
            >{{ item.name }}
          </a-select-option>
        </a-select>
      </a-form-model-item>
      <a-form-model-item label="是否参与返佣分润" prop="is_show">
        <a-radio-group v-model="form.enable_profit">
          <a-radio :value="1"> 参与 </a-radio>
          <a-radio :value="0"> 不参与 </a-radio>
        </a-radio-group>
      </a-form-model-item>
    </a-form-model>
  </a-modal>
</template>

<script>
import { addGradeListAPI, editGradeListAPI } from '@/api/product.js'
export default {
  name: 'AddGrade',
  props: {
    isShowAdd: {
      type: Boolean,
      default: false
    },
    object: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      title: '新增',
      form: {
        brand_id: process.env.VUE_APP_BRAND_ID,
        enable_profit: 1,
        ids: '',
        level_id: '',
        money: '',
        type: undefined
      },
      formRule: {
        level_id: [{ required: true, message: '请输入等级ID' }],
        money: [{ required: true, message: '请输入金额' }]
      }
    }
  },
  watch: {
    isShowAdd(boolean) {
      if (boolean) {
        this.title = '新增'
        if (Object.values(this.object).length > 0) {
          this.title = '修改信息'
          console.log(this.object)
          this.form.ids = this.object.id
          this.form.enable_profit = this.object.enable_profit
          this.form.level_id = this.object.level_id
          this.form.money = this.object.money
          this.form.type = this.object.type
        }
      } else {
        this.form = {
          brand_id: process.env.VUE_APP_BRAND_ID,
          enable_profit: 1,
          ids: '',
          level_id: '',
          money: '',
          type: undefined
        }
        this.$refs.formRef.resetFields()
      }
    }
  },
  methods: {
    onOk() {
      this.$refs.formRef.validate(async valid => {
        if (!valid) return
        if (this.title == '新增') {
          await addGradeListAPI(this.form)
        }
        if (this.title == '修改信息') {
          await editGradeListAPI(this.form)
        }
        this.$message.success('操作成功')
        this.$emit('upload')
        this.$emit('update:isShowAdd', false)
        this.$emit('update:object', {})
      })
    },
    onCancel() {
      this.$emit('update:isShowAdd', false)
      this.$emit('update:object', {})
    }
  }
}
</script>

<style lang="less" scoped></style>
